<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
    <head>
        <base href="<%=basePath%>">
        <title>借阅管理界面</title>

        <link rel="stylesheet" type="text/css" href="css/admin/borrowDetail.css">

        <%-- 引入jquery --%>
        <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>

        <%--  引入bootstrap框架--%>
        <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
        <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>

        <%-- 引入Bootstrap datetimepicker插件 --%>
        <link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />
        <script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
        <script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>

        <%-- 引入pagination --%>
        <link type="text/css" href="jquery/bs_pagination-master/css/jquery.bs_pagination.min.css" rel="stylesheet"/>
        <script type="text/javascript" src="jquery/bs_pagination-master/js/jquery.bs_pagination.min.js"></script>
        <script type="text/javascript" src="jquery/bs_pagination-master/localization/en.js"></script>

        <script type="text/javascript">
            $(function (){
                // 调用查询页面函数
                queryBookInformationByPage(1,10);

                // 给查询书籍按钮添加单击事件
                $("#queryBooks").click(function (){
                    queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'))
                });

                // 当容器加载完成之后，对容器调用工具函数
                $("#endDate").datetimepicker({
                    language:'zh-CN', // 语言 中文
                    format:'yyyy-mm-dd', // 日期格式
                    minView:'month', // 可以选择的最小视图
                    autoclose:true, // 设置选择完日期后是否自动关闭日历，默认是false
                    initalDate:new Date(), // 初始化显示的日期
                    todayBtn:true, // 表示是否显示今天按钮，默认是false
                    clearBtn:true, // 设置是否显示清空按钮，默认是false
                    pickerPosition:'top-left'
                });

                // 给所有的借阅按钮添加单击事件
                $("#body").on("click","button[name='borrowBookBtn']",function (){
                    // 收集表单信息
                    $("#bookId").val(this.value);
                    // 清空输入框
                    $("#userAccount").val("");
                    $("#userName").val("");
                    $("#endDate").val("");
                    // 显示模态窗口
                    $("#myModal").modal("show");
                });

                // 给借阅查询按钮添加单击事件
                $("#borrowByUserAct").click(function (){
                    // 收集表单
                    var userAccount=$.trim($("#userAccount").val());
                    // 发起请求
                    $.ajax({
                        url: 'workbench/admin/borrowAndReturn/getUserName.do',
                        data: {
                            userAccount:userAccount
                        },
                        dataType: 'json',
                        type:'post',
                        success:function (data){
                            if (data.code=="1"){
                                $("#userName").val(data.otherObject.userName)
                            }else{
                                alert("用户不存在！");
                            }
                        }
                    });
                });

                // 给确定借阅添加单击事件
                $("#saveBorrowBook").click(function (){
                    // 收集表单书籍
                    var bookId= $("#bookId").val();
                    var userAccount=$.trim($("#userAccount").val());
                    var endDate=$("#endDate").val();
                    // 发送请求
                    $.ajax({
                       url:'workbench/admin/borrowAndReturn/insertBorrow.do',
                       data:{
                           userAccount:userAccount,
                           bookId:bookId,
                           endDate:endDate
                       },
                        dataType:'json',
                        type:'post',
                        success:function (data){
                           if(data.code=="1"){
                               // 关闭模态窗口
                               $("#myModal").modal("hide");
                               // 更新列表
                               queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'))
                           }else{
                               alert(data.message);
                               // 模态窗口不关闭
                               $("#myModal").modal("show");
                           }
                        }
                    });
                });

                // 给归还书籍添加单击事件
                $("#returnBooks").click(function (){
                    // 清空输入框
                    $("#userAccountReturn").val("");
                    $("#userNameReturn").val("");
                    $("#returnBookSelect").html("");
                    // 显示模态窗口
                    $("#myModalUpdate").modal("show");
                });

                // 给归还查询按钮添加单击事件
                $("#returnByUserAct").click(function (){
                    // 收集表单
                    var userAccount=$.trim($("#userAccountReturn").val());
                    // 发起请求
                    $.ajax({
                        url: 'workbench/admin/borrowAndReturn/getUserName.do',
                        data: {
                            userAccount:userAccount
                        },
                        dataType: 'json',
                        type:'post',
                        success:function (data){
                            if (data.code=="1"){
                                $("#userNameReturn").val(data.otherObject.userName);
                                $("#userId").val(data.otherObject.userId);
                            }else{
                                alert("用户不存在！");
                                return;
                            }
                        }
                    });

                });

                // 给下拉框查询按钮添加单击事件
                $("#selectBookForReturn").click(function (){
                    var userId=$("#userId").val();
                    // 根据用户id查询显示归还的书籍
                    $.ajax({
                        url:'workbench/admin/borrowAndReturn/queryNotReturnBookInfo.do',
                        data:{
                            'userId':userId
                        },
                        type:'post',
                        dataType:'json',
                        success:function (data){
                            if (data.code=='1'){
                                // 显示下拉框
                                var htmlStr="<option>ISBN-书籍名称-作者-节约时间</option>";
                                $.each(data.otherObject,function (index,book){
                                    htmlStr+="<option name=\""+book.borrowId+"\" value=\""+book.bookId+"\">"+book.bookAccount+"-"+book.bookName+"-"+book.author+"-"+book.borrowDate+"</option>"
                                });
                                $("#returnBookSelect").html(htmlStr);
                            }else{
                                alert(data.message);
                                return;
                            }
                        }
                    });
                });

                // 给确定归还按钮添加单击事件
                $("#returnBookBtn").click(function (){
                    // 收集表单数据
                    var bookId=$("#returnBookSelect").val();
                    var borrowId=$("#returnBookSelect").find("option:selected").attr("name");
                    // 发送请求
                    $.ajax({
                       url:'workbench/admin/borrowAndReturn/returnBook.do',
                        data:{
                           bookId:bookId,
                           borrowId:borrowId
                        },
                        type:'post',
                        dataType:'json',
                        success:function (data){
                           if (data.code=="1"){
                               // 关闭模态窗口
                               $("#myModalUpdate").modal("hide");
                               // 刷新列表
                               queryBookInformationByPage(1,$("#search_bo").bs_pagination('getOption','rowsPerPage'));
                           }else{
                               alert(data.message);
                               // 模态窗口不关闭
                               $("#myModalUpdate").modal("show");
                           }
                        }
                    });
                });
            });

            // 根据条件查询所有的书籍信息
            function queryBookInformationByPage(pageNo,pageSize) {
                // 收集表单
                var bookAccount = $.trim($("#book_account").val());
                var author = $.trim($("#author").val());
                var bookName = $.trim($("#book_name").val());

                // 发送ajax请求查询信息
                $.ajax({
                    url: 'workbench/admin/borrowAndReturn/queryExistedBookByActNameAuthor.do',
                    type: 'post',
                    dataType: 'json',
                    data: {
                        bookName: bookName,
                        author: author,
                        bookAccount: bookAccount,
                        pageNo: pageNo,
                        pageSize: pageSize
                    },
                    success: function (res) {
                        var str = "";
                        str += "<tr>";
                        str += "<td>ISBN</td>";
                        str += "<td>书籍名称</td>";
                        str += "<td>作者</td>";
                        str += "<td>出版社</td>";
                        str += "<td>价格</td>";
                        str += "<td>操作</td>";
                        str += "</tr>";
                        // 渲染页面
                        $.each(res.books, function (index, obj) {
                            str += "<tr>";
                            str += "<td>" + obj.bookAccount + "</td>";
                            str += "<td>" + obj.bookName + "</td>";
                            str += "<td>" + obj.author + "</td>";
                            str += "<td>" + obj.publisher + "</td>";
                            str += "<td>" + obj.price + "</td>";
                            // str+="<td><button>删除<button></td>";
                            str += "<td><button name=\"borrowBookBtn\" value=\"" + obj.bookId + "\">借阅</button></td>";
                            str += "</tr>";
                        });
                        $("#body").html(str);
                        // 计算总页数
                        var totalPages = Math.ceil(res.totalRows / pageSize);
                        // 对容器调用bs_pagination工具函数，显示翻页信息
                        $("#search_bo").bs_pagination({
                            currentPage: pageNo, // 当前页号，默认值1，相当于pageNo
                            // 必须满足 totalRows=totalPages*rowsPerPage
                            totalPages: totalPages, // 总页数，必填项
                            rowsPerPage: pageSize, // 每页显示条数，默认是10，相当于pageSize
                            totalRows: res.totalRows, // 总条数，默认值是1000
                            visiblePageLinks: 5, //最多可以显示的一组卡片数，默认是5
                            showGoToPage: true, // 是否显示跳转到第几页部分，默认是true
                            showRowsPerPage: true, // 是否显示每页显示条数部分，默认是true
                            showRowsInfo: true, //是否显示记录的信息部分，默认是true
                            // 用户每次切换页面的时候执行函数
                            // 该函数返回切换页号之后的pageNo和pageSize
                            onChangePage: function (event, pageObj) {
                                queryBookInformationByPage(pageObj.currentPage, pageObj.rowsPerPage);
                            }
                        })
                    }
                })
            }

        </script>
    </head>
    <body>

        <%-- 借阅书籍模态窗口 --%>
        <div class="modal fade" id="myModal">
            <div id="search_add">
                <div id="search_body_add">
                    <form method="post" action="#">
                        <input type="hidden" id="bookId">
                        <div>
                            <label>用户账号</label>
                            <input class="in" type="text" id="userAccount" name="id" required="required" />
                            <input type="button" value="查询" id="borrowByUserAct" style="width:60px;position: absolute;right: 13px;top: 23px;"/>
                        </div>
                        <div>
                            <label>用户姓名</label>
                            <input class="in" type="text" id="userName" name="id" readonly/>
                        </div>
                        <div>
                            <label>截止时间</label>
                            <input class="in" type="text" id="endDate" required="required" name="publisher" readonly />
                        </div>
                        <div>
                            <input class="update"  type="button" value="借阅" id="saveBorrowBook"/>
                            <input class="update" type="button" value="返回" data-dismiss="modal" />
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <%-- 归还书籍模态窗口 --%>
        <div class="modal fade" id="myModalUpdate">
            <div id="search_update">
                <div id="search_body_update">
                    <form method="post" action="#">
                        <div>
                            <input type="hidden" id="userId" value="222">
                            <label>用户账号</label>
                            <input class="in" type="text" id="userAccountReturn" name="id" required="required" />
                            <input type="button" value="查询" id="returnByUserAct" style="width:60px;position: absolute;right: 13px;top: 23px;"/>
                        </div>
                        <div>
                            <label>用户姓名</label>
                            <input class="in" type="text" id="userNameReturn" name="id" readonly/>
                        </div>
                        <div>
                            <label>归还书籍</label>
                            <select id="returnBookSelect" style="width:250px;position:relative;left:45px">

                            </select>
                            <input type="button" value="查询" id="selectBookForReturn" style="width:60px;position: absolute;right: 13px;bottom: 63px;"/>
                        </div>
                        <div>
                            <input id="returnBookBtn" type="button" value="归还"/>
                            <input class="update" type="button" value="返回" data-dismiss="modal" />
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!--主窗口-->
        <div class="body_right">
            <div id="search">
                <div id="search_head">
                    <form id ="form1" method="post" action="AddRecordServlet">
                        <span>ISBN</span><input class="search_in" id="book_account" type="text"/>
                        <span>图书名称</span><input class="search_in" id="book_name" type="text"/>
                        <span>作者</span><input class="search_in" id="author" type="text"/>
                        <input class="search_id" type="button" id="queryBooks" value="查询书籍">
                        <input class="search_id" type="button" id="returnBooks" value="归还书籍">
                    </form>
                </div>

                <div id="search_body">
                    <table border="1px" id="body">

                    </table>
                </div>

                <div id="search_bo">

                </div>
            </div>
        </div>
    </body>
</html>
